<style scoped>
.cc {
  color: red;
}

</style>
<template>
  <!--  <Card style="padding:0;"></Card> -->
  <div style="background:#fff;">
    <Row style="text-align:left;padding:10px 0;">
      <Col span="12">
      <Input v-model="value13" placeholder="类型/品牌/测能类型">
      <Button slot="append" icon="ios-search" type="info"></Button>
      </Input>
      </Col>
      <Col span="12" style="text-align:right;">
      <Button type="info">设置模块</Button>
      <!-- <Button type="info" @click="exportData(1)" icon="ios-download-outline">导出</Button>
          <Button type="success" icon="android-add-circle">新增</Button>
          <Button type="error" icon="ios-trash-outline">删除</Button> -->
      </Col>
    </Row>
    <Table border :columns="columns7" :data="data6" ref="table"></Table>
    <Row style="text-align:right;padding:10px 0;">
      <Page :total="40" size="small" show-elevator show-sizer></Page>
    </Row>
  </div>
</template>
<script>
export default {
  data: function () {
    return {
      value13: '',
      columns7: [{
        type: 'selection',
        width: 60,
        align: 'center'
      }, {
        type: 'index',
        width: 60,
        align: 'center'
      }, {
        title: '类型',
        key: 'type',
        align: 'center'
        /* ,
                  render: (h, params) => {
                    return h('div', [
                      h('Icon', {
                        props: {
                          type: 'person'
                        }
                      }),
                      h('strong', params.row.type)
                    ])
                  } */
      }, {
        title: '编号',
        key: 'number',
        align: 'center'
      }, {
        title: '品牌',
        key: 'band',
        align: 'center'
      }, {
        title: '所属空间',
        key: 'space',
        align: 'center'
      }, {
        title: '添加人',
        key: 'operator',
        align: 'center'
      }, {
        title: '添加时间',
        key: 'createTime',
        align: 'center'
      }, {
        title: '状态',
        key: 'status',
        align: 'center'
      }, {
        title: '操作',
        key: 'action',
        width: 150,
        align: 'center',
        render: (h, params) => {
          return h('div', [
            /* h('Button', {
              props: {
                type: 'ghost',
                size: 'small'
              },
              style: {
                margin: '3px',
                color: '#2db7f5'
              },
              on: {
                click: () => {
                  let self = this
                  let config = {
                    title: '提示',
                    content: '您确定删除吗？',
                    onOk: function () {
                      self.remove(params.index)
                    }
                  }
                  this.$Modal.confirm(config)
                }
              }
            }, '删除'),
            h('Button', {
              props: {
                type: 'default',
                size: 'small'
              },
              style: {
                margin: '3px',
                color: '#2db7f5'
              },
              on: {
                click: () => {
                  this.show(params.index)
                }
              }
            }, '编辑'),
            h('Button', {
              props: {
                type: 'default',
                size: 'small'
              },
              style: {
                margin: '3px',
                color: '#2db7f5'
              },
              on: {
                click: () => {
                  this.show(params.index)
                }
              }
            }, '调试设备'), */
            h('Button', {
              props: {
                // type: 'text',
                size: 'small'
              },
              style: {
                margin: '3px',
                color: '#2db7f5'
              },
              on: {
                click: () => {
                  this.show(params.index)
                }
              }
            }, '查看设备配置')
          ])
        }
      }],
      data6: [{
        type: '电表',
        model: 'DB1',
        number: 18,
        brand: '西门子',
        space: '冲压车间',
        operator: '张三',
        createTime: '2018-04-21 14:28:26',
        status: 1
      }, {
        type: '电表',
        model: 'DB1',
        number: 18,
        brand: '西门子',
        space: '冲压车间',
        operator: '张三',
        createTime: '2018-04-21 14:28:26',
        status: 1
      }, {
        type: '电表',
        model: 'DB1',
        number: 18,
        brand: '西门子',
        space: '冲压车间',
        operator: '张三',
        createTime: '2018-04-21 14:28:26',
        status: 1
      }, {
        type: '电表',
        model: 'DB1',
        number: 18,
        brand: '西门子',
        space: '冲压车间',
        operator: '张三',
        createTime: '2018-04-21 14:28:26',
        status: 1
      }]
    }
  },
  methods: {
    show: function (index) {
      this.$Modal.info({
        title: '设备信息',
        content: `类型：${this.data6[index].type}<br>型号e：${this.data6[index].model}<br>编号${this.data6[index].number}`
      })
    },
    remove: function (index) {
      this.data6.splice(index, 1)
    },
    exportData: function () {
      let self = this
      this.$refs.table.exportCsv({
        filename: '设备管理数据',
        columns: this.columns7,
        data: self.data6.map((data, index) => {
          let tem = JSON.parse(JSON.stringify(data))
          tem.createTime = '="' + tem.createTime + '"'
          return tem
        })
      })
    }
  }
}

</script>
